import "@site/src/languages/highlight";
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';

# Dora Start!

## 1. Installation

### Android

- 1. Download and install the [APK](https://github.com/ippclub/Dora-SSR/releases/latest) package on the game's running terminal.
- 2. Run the software and access the server address displayed by the software through the browser of the PC (tablet or other development device) in the LAN.
- 3. Start game development.

### Windows

- 1. Ensure that you have the X86 Visual C++ Redistributable for Visual Studio 2022 (the MSVC runtime package vc_redist.x86) installed to run this application. You can download it from the [Microsoft website](https://learn.microsoft.com/en-us/cpp/windows/latest-supported-vc-redist?view=msvc-170).
- 2. Download and run the [software](https://github.com/ippclub/Dora-SSR/releases/latest).
- 3. Access the server address displayed by the software through a browser.
- 4. Start game development.

### macOS

- 1. Download and run the [software](https://github.com/ippclub/Dora-SSR/releases/latest). You may see a prompt saying "Dora cannot be opened" when you first run the software. Please go to "System Preferences" > "Security & Privacy" and click "Open Anyway". Or you can install with [Homebrew](https://brew.sh) using:
	```sh
	brew install --cask ippclub/tap/dora-ssr
	```
- 2. Access the server address displayed by the software through a browser.
- 3. Start game development.

### Linux

- 1. Installation.
	- Ubuntu
		```sh
		sudo add-apt-repository ppa:ippclub/dora-ssr
		sudo apt update
		sudo apt install dora-ssr
		```
	- Debian Bookworm
		```sh
		sudo apt-key adv --keyserver hkp://keyserver.ubuntu.com:80 --recv-keys 9C7705BF
		sudo add-apt-repository -S "deb https://ppa.launchpadcontent.net/ippclub/dora-ssr/ubuntu jammy main"
		sudo apt update
		sudo apt install dora-ssr
		```
- 2. Run the software and access the server address displayed by the software through a browser.
- 3. Start game development.

## 2. Write the Game

1. Step One: Create a new project
	- In the browser, right click on the menu "Assets" of the resource tree on the left side of the Dora Dora editor.
	- Click the `New` menu item, select "New Folder", and name it `Hello`.
2. Step Two: Write the game code
	- Create a new game entry code file in the project folder, select the Lua language (or Teal, TypeScript, YueScript), and name it `init`.
	- Write the code:

<Tabs groupId="language-select">
<TabItem value="lua" label="Lua">

```lua title="Hello/init.lua"
-- import modules
local Sprite <const> = require("Sprite")
local Node <const> = require("Node")
local Move <const> = require("Move")
local Ease <const> = require("Ease")

-- create the root node of the game scene tree
local root = Node()

-- create a sprite
local sprite = Sprite("Image/logo.png")

-- mount the sprite to the root node
sprite:addTo(root)

-- register for click events to move the sprite
root:onTapBegan(function(touch)
	sprite:perform(
		Move(
			1, -- duration in seconds
			sprite.position, -- start position
			touch.location, -- end position
			Ease.OutBack -- easing function
		)
	)
end)
```

</TabItem>
<TabItem value="tl" label="Teal">

```tl title="Hello/init.tl"
-- import modules
local Sprite <const> = require("Sprite")
local Node <const> = require("Node")
local Move <const> = require("Move")
local Ease <const> = require("Ease")
local type Touch = require("Touch")

-- create the root node of the game scene tree
local root = Node()

-- create a sprite
local sprite = Sprite("Image/logo.png")

if not sprite is nil then
	-- mount the sprite to the root node
	root:addChild(sprite)

	-- register for click events to move the sprite
	root:onTapBegan(function(touch: Touch.Type)
		sprite:perform(
			Move(
				1, -- duration in seconds
				sprite.position, -- start position
				touch.location, -- end position
				Ease.OutBack -- easing function
			)
		)
	end)
end
```

</TabItem>
<TabItem value="ts" label="TypeScript">

```ts title="Hello/init.ts"
// import modules
import {Ease, Move, Node, Slot, Sprite} from 'Dora';

// create the root node of the game scene tree
const root = Node();

// create a sprite
const sprite = Sprite("Image/logo.png");

if (sprite) {
	// mount the sprite to the root node
	root.addChild(sprite);

	// register for click events to move the sprite
	root.onTapBegan(touch => {
		sprite.perform(
			Move(
				1, // duration in seconds
				sprite.position, // start position
				touch.location, // end position
				Ease.OutBack // easing function
			)
		);
	});
}
```

</TabItem>
<TabItem value="tsx" label="TSX">

```tsx title="Hello/init.tsx"
// @preview-file on
import {React, toNode, toAction, useRef} from 'DoraX';
import {Ease, Sprite, Touch} from 'Dora';

const sprite = useRef<Sprite.Type>();

// define the touch event handler
const onTapBegan = (touch: Touch.Type) => {
	const {current} = sprite;
	if (current) {
		const {x, y} = touch.location;
		current.perform(toAction(
			<move time={1}
				startX={current.x} startY={current.y}
				stopX={x} stopY={y}
				easing={Ease.OutBack}
			/>
		));
	}
};

// create the root node of the game scene tree
// and a sprite as a child node
toNode(
	<node onTapBegan={onTapBegan}>
		<sprite ref={sprite} file='Image/logo.png'/>
	</node>
);
```

</TabItem>
<TabItem value="yue" label="YueScript">

```yue title="Hello/init.yue"
-- import modules
_ENV = Dora

-- create a sprite
sprite = Sprite "Image/logo.png"

-- create the root node of the game scene tree
with Node!

	-- mount the sprite to the root node
	\addChild sprite

	-- register for click events to move the sprite
	\onTapBegan (touch) ->
		sprite\perform Move(
			1 -- duration in seconds
			sprite.position -- start position
			touch.location -- end position
			Ease.OutBack -- easing function
		)
```

</TabItem>
</Tabs>

3. Step Three: Run the game

Click the `🎮` icon in the lower right corner of the editor, then click the `Run` menu item. Alternatively, press the `Ctrl + r` key combination.

## 3. Publish the Game

1. Open the right-click menu of the newly created project folder in the game resource tree on the left side of the editor.
2. Click the `Download` option and wait for the browser to prompt for downloading the packaged project file.
